<template>
  <div>
    <h_header></h_header>
    <h_right></h_right>
    <!-- 企业文化 -->
    <div class="aboutMe">
      <!-- 关于我们 -->
      <div class="aboutTop">
        <h2>关于我们</h2>
        <div class="inlineBlue"></div>
        <p>专注互联网信息化服务</p>
      </div>
      <div class="aboutCenterTitle">
        <div class="lineLeft"></div>
        <a href="javascript:void(0);" class="aboutIntro" @click="change1"
          >公司简介</a
        >
        <a
          href="javascript:void(0);"
          class="aboutCulture change"
          @click="change2"
          >企业文化</a
        >
        <div class="lineRight"></div>
      </div>
      <!-- 企业文化 -->
      <div class="cCard">
        <div class="first">
          <div class="cultureCard">
            <p>COMPANY PROFILE</p>
            <div class="cultureTitle">
              <span>企业文化</span>
            </div>
          </div>
        </div>
        <div class="content">
          <div class="foreword">
            <h3 class="forewordTitle">前言</h3>
            <p class="forewordContent">珠联璧合，互利共赢</p>
            <img src="@/assets/gong.png" alt="" />
          </div>
          <!-- mainSpirit -->
          <div class="mainSpirit">
            <h3 class="mainTitle">核心精神</h3>
            <p class="mainText">
              共创 共赢 共知 共享
              与广大企业无私共享，坚定共创事业，真心诚意地为企业服务，实现共赢
            </p>
          </div>
          <!-- servicsThink -->
          <div class="servicsThink">
            <h3>服务理念</h3>
            <p>
              “共创模式” 即本公司作为软件服务提供商，
              与来自传统产业的企业或者初创公司共同组成共创团队，
              该团队致力于帮助企业创造价值,成为企业的专业软件技术团队，为企业带来低成本，高质量的软件服务，帮助企业获得竞争优势。
            </p>
          </div>
          <!-- 合作模式 -->
          <div class="hezuo">
            <h3>合作模式</h3>
            <ul>
              <li>1.项目不用继续维护和迭代，可以将项目全部资料带走</li>
              <li>2.为期提供长期，高效，高质量的维护服务和后期项目迭代。</li>
              <li>
                3.当公司自己要组建技术团队时，该项目的技术研发人员可由公司全部带走。
              </li>
            </ul>
          </div>
          <!-- 特点 -->
          <div class="trait">
            <h3>特点</h3>
            <ul>
              <li>1.珠联璧合，互利共赢</li>
              <li>2.所有开发资料透明，可全部带走</li>
              <li>3.研发团队可带走。</li>
            </ul>
          </div>
          <!-- 团队特色 -->
          <div class="teamCharacteristics">
            <h3>团队特色</h3>
            <p>
              本公司技术研发人员大多来自高校的在校生，他们与学校共同学习成长，有强烈的团队意识
            </p>
            <ul>
              <li v-for="item of teamList" :key="item.index">
                <img :src="item.teamUrl" alt="" />
                <span>{{ item.teamcontent }}</span>
              </li>
            </ul>
          </div>
        </div>
      </div>
    </div>
    <h_question></h_question>
    <h_footer></h_footer>
  </div>
</template>
<script>
import h_header from "@/components/header/header.vue";
import h_right from "@/components/right/right.vue";
import h_footer from "@/components/footer/footer.vue";
import h_question from "@/components/question/question.vue";
import h_top from "@/components/top/top.vue";
export default {
  components: {
    h_header: h_header,
    h_right: h_right,
    h_footer: h_footer,
    h_question: h_question,
    h_top: h_top,
  },
  data() {
    return {
      t: 2,
      number: "",
      workCardContent: [
        "初创公司，并没有足够资金，也很难找到志同道合的技术人才，唯一有的或许只是一个愿景，和更多牛人企业一起合作，并非如此容易。特别是在重庆这个大城市，有很多大型的、有名气的外包公司，要让企业放弃，然后选择一个没有经验的初创企业，这确实一个艰难选择。同时，企业想要把项目外包出去也有很多的问题，例如：很难找到合适的外包公司，付出的时间和精力多、拿不到项目的全部资料、项目质量难保证等。因此，我们公司打造了一套模式——共创模式！",
        "“共创模式”是我公司独特的合作模式，秉持“珠联璧合，互利共赢”的信念，与来自传统产业的企业或者初创公司共同组成共创团队，致力于帮助企业创造价值,成为企业的专业软件技术团队，为企业带来低成本，高质量的软件服务，帮助企业获得竞争优势。在这样的合作模式下，合作企业可参与到项目中，与我们共同讨论项目，从而为企业提供质量高标准的产品；已合作为第一的理念，大多数传统外包公司在老项目的维护上出现拖延时间或另外要价的情况，我们为了避免这种情况，为企业提供长期、高效的项目维护服务；有不少的公司不愿为合作企业提供完整的项目开发资料，而我们全部开发资料透明，可全部带走。还有的公司外包服务能力不完整，软件架构不合理、平台管理不善、开发人员经验不足等低效、低质的团队，我们则可为合作企业提供项目研发的技术团队。",
      ],
      questionList: [
        "你们能做什么？",
        "需要多少钱？",
        "需要多久？",
        "我需要做什么？",
        "需要提供什么资料？",
        "售后服务怎么样？",
      ],
      teamList: [
        {
          teamUrl: require("@/assets/about/cur1.jpg"),
          teamcontent: "令行禁止，恪守承诺",
        },
        {
          teamUrl: require("@/assets/about/cur2.jpg"),
          teamcontent: "令实事求是，锲而不舍",
        },
        {
          teamUrl: require("@/assets/about/cur3.jpg"),
          teamcontent: "挑战自我，追求卓越",
        },
        {
          teamUrl: require("@/assets/about/cur4.jpg"),
          teamcontent: "沟通协作，创造共赢",
        },
        {
          teamUrl: require("@/assets/about/cur5.jpg"),
          teamcontent: "勇于变革，探索新知",
        },
      ],
    };
  },
  created() {
    this.t = window.sessionStorage.getItem("lastnumber");
    // console.log(this.t);
  },
  methods: {
    change1() {
      this.t = 1;
      window.sessionStorage.setItem("lastnumber", this.t);
      console.log(this.t);
      this.$router.push({ path: "/CompanyIntro" });
    },
    change2() {
      this.t = 2;
      window.sessionStorage.setItem("lastnumber", this.t);
      console.log(this.t);
      this.$router.push({ path: "CompanyCulture" });
    },
  },
};
</script>

<style lang="scss">
@mixin forewordTitle {
  margin: 0 0 25px;
  font: {
    weight: 400;
    size: 25px;
  }
}
@mixin forewordContent {
  margin: 13px 0;
  font-size: 13px;
}
@mixin li {
  list-style: none;
  line-height: 20px;
  height: 20px;
  margin: 15px 0;
}
.aboutTop {
  background: url(../../assets/about/about.jpg) no-repeat;
}
.aboutMe {
  width: 100%;
  height: 100%;
  min-width: 1300px;
}
.bottomImg {
  width: 100%;
  background: #f6f7fc;
  text-align: center;
  margin-bottom: 45px;
}

.content {
  width: 100%;
  box-sizing: border-box;
  padding: 20px 100px;
  .foreword {
    .forewordTitle {
      @include forewordTitle;
    }
    .forewordContent {
      @include forewordContent;
    }
    img {
      display: block;
      text-align: center;
      margin: 0 auto;
      margin-top: 30px;
      transform: scale(1.2);
    }
  }
  // mainSpirit
  .mainSpirit {
    .mainTitle {
      @include forewordTitle;
      margin: 70px 0 25px;
    }
    .mainText {
      @include forewordContent;
    }
  }
  // servicsThink
  .servicsThink {
    h3 {
      @include forewordTitle;
      margin: 70px 0 25px;
    }
    p {
      @include forewordContent;
    }
  }
  // 合作模式
  .hezuo {
    h3 {
      @include forewordTitle;
      margin: 70px 0 25px;
    }
    li {
      @include li;
    }
  }
  // 特点
  .trait {
    h3 {
      @include forewordTitle;
      margin: 70px 0 25px;
    }
    li {
      @include li;
    }
  }
  // 团队特色
  .teamCharacteristics {
    h3 {
      @include forewordTitle;
      margin: 70px 0 25px;
    }
    p {
      @include forewordContent;
    }
    ul {
      width: 1100px;
      display: flex;
      justify-content: space-between;
      margin: 50px 0 100px 0;
      padding-left: 40px;
      li {
        @include li;
        list-style: none;
        display: flex;
        flex-direction: column;
        text-align: center;
        width: 140px;
      }
      img {
        width: 110px;
        margin: 0 auto;
      }
      span {
        text-align: center;
        font-size: 14px;
        color: #000;
      }
    }
  }
}
</style>
